.course-list {
    padding: 20px 10px;
    position: relative;
    min-height: 500px;
}
.course-list ul:after{
    content:'\0020';
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}
.course-list ul{
    *zoom:1;
}
.course-list li {
    background: #fff;
    background: #f7faf9\0/;
    *background: #f7faf9;
    border-bottom: 2px solid #f7faf9\0/;
    *border-bottom: 2px solid #f7faf9;
    border-radius: 0 0 1px 1px;
    float: left;
    margin: 5px 10px 15px;
    width: 280px;
    height: 240px;
    position: relative;
    box-shadow: 0 1px 2px #c5c5c5;
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
}
.course-list li .course-list-img {
    width: 280px;
    height: 160px;
    overflow: hidden;
    position: relative;
    *display: inline;
}
.course-list li .course-list-img img {
    display: block;
    transition: 1s;
    -moz-transition: 1s;
    -webkit-transition: 1s;
    -o-transition: 1s;
}
.course-list li .course-list-img span {
    position: absolute;
    bottom: -19px;
    width: 280px;
    height: 24px;
    line-height: 24px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    background: #39b94e;
    z-index: 1;
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    *display: none;
}
.course-list li h5 {
    color: #363d40;
    line-height: 50px;
    text-align: center;
    margin: 0 10px;
    overflow: hidden;
    text-overflow:ellipsis;
    white-space: nowrap;
    font-weight: normal;
    font-family: "Microsoft YaHei";
    text-decoration: none;
}

.course-list li h5 .topicon {
    padding:5px 0 5px 35px;
    background: url(http://static.mukewang.com/static/img/course/dot_recommend.png) no-repeat left center;
}
.course-list li .intro {
    position: absolute;
    padding: 0 14px;
    opacity: 0;
    top: 160px;
    left: 0px;
    width: 100%;
    background: #fff;
    background: #f7faf9\0/;
    *background: #f7faf9;
    display: none\0/;
    *display: none;
    font-size: 12px;
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
}
.course-list li .intro p {
    padding-top: 10px;
    height: 40px;
    line-height: 20px;
    word-wrap: break-word;
    word-break:break-all;
    text-decoration: none;
}
.course-list li .intro span {
    color: #b4bbbf;
    text-decoration: none;
}
.course-list li .tips {
    padding: 0 14px;
    font-size: 12px;
    color: #b4bbbf;
}
.course-list li .new {
    color: #86d693 !important;
}
.course-list li:hover,
.course-list li.hover {
    border-bottom: 2px solid #dae0e5\0/;
    *border-bottom: 2px solid #dae0e5;
    box-shadow: 0 2px 8px #bbb;
}
.course-list li:hover img,
.course-list li.hover img {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
}
.course-list li:hover span,
.course-list li.hover span {
    bottom: 0px;
    *display: block;
}
.course-list li:hover .intro,
.course-list li.hover .intro {
    color: #656e73;
    opacity: 1;
    display: block\0/;
    *display: block;
}
.course-list .btn-next {
    border: 1px solid #d0d6d9;
    display: block;
    margin: 10px 0;
    margin-left: 310px;
    width: 278px;
    height: 48px;
    line-height: 48px;
    text-align: center;
}
.course-list .btn-loading {
    border: 0;
    height: 52px;
    text-indent: -99em;
    overflow: hidden;
    background: #ffffff url(http://static.mukewang.com/static/img/course/loading.gif?t=1) center center no-repeat;
}


